window.onload = function () {
    let divobj = document.getElementById("content");
    $.ajax({
        type: "post",//请求方式   get  post
        url: "/js/茶叶回显",//接口地址
        data: null,//是否携带参数
        dataType: "json",//数据类型
        success: function (teaString) { //回调函数   teaString表示后台接口返回的数据
            let arr = JSON.parse(teaString);
            let s = "";  
            for (let i=0;i<arr.length;i++) {
                s+=`<div class="part" onclick="describe(${arr[i].id})">`
                s+=`<div class="area" id="area">`
                s+=`<div class="imgdiv">`
                s+=`<img src="../img/tea-img/${arr[i].teaimg}" alt="">`
                s+=`</div>`
                s+=`<div class="font1">${arr[i].teaname}</div>`
                s+=`<div class="bigbox">`
                s+=`<div class="box1"></div>`
                s+=`<div class="box2"></div>`
                s+=`</div>`
                s+=`<div class="font2">￥${arr[i].teaprice}</div>`
                s+=`<div class="box3">`
                s+=`<a href="">→</a>`
                s+=`</div>`
                s+=`</div>`
                s+=`</div>`

            }
            divobj.innerHTML = s;
            let areaobj=document.getElementsByClassName("area");
            for(let i=0;i<areaobj.length;i++){
                areaobj[i].style.animation="scroll1 1s linear forwards ."+i+"s";
            }
            // areaobj[0].style.animation = "scroll1 1s linear forwards .1s";
            // areaobj[1].style.animation = "scroll1 1s linear forwards .15s";
            // areaobj[2].style.animation = "scroll1 1s linear forwards .2s";
            // areaobj[3].style.animation = "scroll1 1s linear forwards .25s";
            // areaobj[4].style.animation = "scroll1 1s linear forwards .3s";
            // areaobj[5].style.animation = "scroll1 1s linear forwards .35s";
            // areaobj[6].style.animation = "scroll1 1s linear forwards .4s";
            // areaobj[7].style.animation = "scroll1 1s linear forwards .45s";
            // areaobj[8].style.animation = "scroll1 1s linear forwards .5s";
            // areaobj[9].style.animation = "scroll1 1s linear forwards .55s";
            // areaobj[10].style.animation = "scroll1 1s linear forwards .6s";
            // areaobj[11].style.animation = "scroll1 1s linear forwards .65s";
            // areaobj[12].style.animation = "scroll1 1s linear forwards .7s";
                

        }
    })
}
function view(teatype){
    let obj={
        teatype:teatype
    }
    $.ajax({
        type:"post",//请求方式   get  post
        url:"/js/分类显示",//接口地址
        data:JSON.stringify(obj),//是否携带参数
        dataType:"json",//数据类型
        success:function(s){ //回调函数   data表示后台接口返回的数据
            let divobj = document.getElementById("content");
            divobj.innerHTML="";
            divobj.innerHTML = s;
            let areaobj=document.getElementsByClassName("area");
            for(let i=0;i<areaobj.length;i++){
                areaobj[i].style.animation="scroll1 1s linear forwards ."+i+"s";
            }
        }
    })  
}

function describe(id){
    let teaString=localStorage.Tea;
    let teaArr=JSON.parse(teaString);
    for(let i=0;i<teaArr.length;i++){
        if(id==teaArr[i].id){
            let newtea=new Describe(teaArr[i].id,teaArr[i].teaname,teaArr[i].teatype,teaArr[i].teaimg,teaArr[i].teaprice,teaArr[i].teadescribe);
            let arr=[newtea];
            localStorage.Describe=JSON.stringify(arr);
        }
    }
    location.href="茶叶简介.html";
}